<template>
    <!-- 数据分析 -->
    <view class='dataAnalyze_page'>
        <!-- 数据总量分析 -->
        <view>
            <view class='title_item'>数据总量分析</view>
            <view class='content_item'>
                <view class='item_box'>
                    <view v-for='(total,i) in content.total' :key='i'>
                        <text>{{convert(total.sourcetype)}}：</text>
                        <text>{{total.hot}}</text>
                    </view>
                </view>
            </view>
        </view>
        <!-- 词云 -->
        <view>
            <view class='title_item'>词云</view>
            <view class='content_item'>
                <view class='item_box'> 
                    <view v-for='(word,w) in content.hotwords' :key='w'>
                        <text>{{word.key}}</text>
                        <text>（{{word.hot}}）</text>
                    </view>
                </view>
            </view>
        </view>
        <!-- 首发分析 -->
        <view>
            <view class='title_item'>首发分析</view>
            <view class='content_item'>
                <view class='list_box'>
                    <view v-for='(first,f) in content.first' :key='f'>
                        <text>【{{first.source}}】</text>
                        <text>{{first.content}}</text>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        props: {
            content: Object,
        },
        data() {
            return {
                convert: this.$convert
            }
        },
        watch: {
            content(val) {
                this.manageData()
            }
        },
        mounted() { 
            this.manageData()
        },
        methods: {
            // 处理数据
            manageData() { 
                let total = 0;
                let is_update = false;
                this.content.total.forEach(val => {
                    if(val.sourcetype == "all") is_update = true
                    total += val.hot;
                });   
                if(is_update) return
                let all = {
                    sourcetype: "all",
                    hot: total
                }
                this.content.total.unshift(all);
            }
        }
    }
</script>

<style lang="scss" scoped>
.dataAnalyze_page {
    width: 100%;
    >view{
        width: 100%;
       .title_item {
           width: 100%;
            font-size: 24upx;
            color: #333;
            font-weight: 600;
            padding-bottom: 25upx ;
       } 
       .content_item {
            font-size: 24upx;
            color: #999;
            .item_box {
                width: 100%;
                display: flex;
                flex-wrap: wrap;
                >view {
                    width: 33.3333%;
                    margin-bottom: 25upx;
                    >text:nth-last-child(1) {
                        color: #333;
                    }
                }
            }
            .list_box {
                width: 100%;
                >view {
                    width: 100%;
                    color: #3A3A3A;
                    margin-bottom: 25upx;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    &:nth-last-child(1) {
                        margin: 0;
                    }
                    >text:nth-last-child(1) {
                        color: #2191FF;
                    }
                }
            }
       }
    }
}
</style>